// 保险起见，写入口函数
$(function () {
    //1.点击a链接，切换盒子
    $("#loginBox a").on("click", function () {
        $("#loginBox").hide();
        $("#registerBox").show();
    });
    $("#registerBox a").on("click", function () {
        $("#registerBox").hide();
        $("#loginBox").show();
    });
    //2.自定义校验规则
    //引入layui的js，就内置了layui对象
    let form = layui.form;
    //form的verify在__proto__里
    //verify()的值是一个对象
    form.verify({
        //属性名是校验规则名称，值可以是数组也可以是函数
        //值是数组
        //uname: [/^[\w]{6,8}$/, "密码的长度为6-15个字符，且不能包含空格"],
        pwd: [
            //数组第一个值是校验规则
            /^[\S]{6,15}$/, //\s指空白，即空格，\S指非空白；[]括起来规则更改更方便，可以在方括号里加东西
            //数组第二个值是报错信息
            "密码的长度为6-15个字符，且不能包含空格",
        ],
        //值是函数
        repwd: function (value) {
            //规则添加给谁，value就是谁的值
            //[name=repassword]是属性选择器
            let oldPwd = $("#registerBox [name=password]").val();
            if (value !== oldPwd) {
                return "两次输入密码不一致";
            }
        },
    });
    //3.注册axios
    let layer = layui.layer;
    $("#form-reg").on("submit", function (e) {
        e.preventDefault();
        axios({
            method: "POST",
            url: "/api/reguser",
            //这个服务器不允许传json格式，只允许传查询字符串
            // data: {
            //  username: $('#registerBox [name=username]'),
            //  password: $('#registerBox [name=password]'),
            // },
            data: $("#form-reg").serialize(),
        }).then((res) => {
            if (res.data.status !== 0) return layer.msg(res.data.message)
            layer.msg('恭喜您，注册成功');
            //清空表单，[0]转化成DOM对象
            $("#form-reg")[0].reset();
            //注册成功后跳转
            $("#registerBox a").triggerHandler('click')
        });
    });
    //4.登录axios
    $("#form-login").on("submit", function (e) {
        e.preventDefault();
        axios({
            method: "POST",
            url: "/api/login",
            data: $("#form-login").serialize(),
        }).then((res) => {
            if (res.data.status !== 0) return layer.msg(res.data.message)
            layer.msg('恭喜您，登录成功');
            //登陆成功后跳转
            location.href = '/index.html';//window是顶级对象，可以省略
            //保存res.data的token
            //token是一个令牌，服务器与客户端的token对比以判断登陆状态
            localStorage.setItem('token', res.data.token);//在application里查看
        });
    });
});
